import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/painting.dart';
import 'package:flutter/rendering.dart';
import 'package:flutter/widgets.dart';
import 'MyListTile.dart';

void main() => runApp(new MyCenterPager());

class MyCenterPager extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "个人中心",
      debugShowCheckedModeBanner: false,
      theme: ThemeData(primarySwatch: Colors.blue),
      home: CenterStatefulWidget(),
    );
  }
}

class CenterStatefulWidget extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new MyCenterState();
  }
}

class MyCenterState extends State {
  var leftIcon = ['images/icon_rangking.png','images/icon_introduction.png','images/icon_resent.png','images/icon_paw_change.png'];
  var message =['完善资料','意见反馈','清除缓存','修改密码'];
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: SafeArea(
            child: SingleChildScrollView(
              child: Container(
                child: Stack(
                  alignment: Alignment.topLeft,
                  children: <Widget>[
                    Image.asset('images/icon_bg_me.png'),
                    Padding(
                      padding: EdgeInsets.only(top: 80.5, left: 28.5),
                      child: new ClipOval(
                        child: new Image.asset(
                          'images/icon_header.jpg',
                          width: 80,
                          height: 80,
                        ),
                      ),
                    ),
                    Padding(
                      padding: EdgeInsets.only(top: 95, left: 128.5),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: <Widget>[
                          Text(
                            "Tracy McGrady",
                            style: TextStyle(
                                color: Color(0xff303133),
                                fontWeight: FontWeight.bold,
                                fontSize: 24),
                          ),
                          Padding(
                            padding: EdgeInsets.only(right: 13),
                            child: Row(
                              mainAxisAlignment: MainAxisAlignment.spaceBetween,
                              children: <Widget>[
                                Text("ID6547898590"),
                                Text(
                                  '当前版本：1.01',
                                  style:
                                  TextStyle(fontSize: 12, color: Color(0xffACACAC)),
                                )
                              ],
                            ),
                          )
                        ],
                      ),
                    ),
                    Padding(
                      padding: EdgeInsets.only(top: 190, left: 13, right: 13),
                      child: Column(
                        children: <Widget>[
                          Card(
                            shape: RoundedRectangleBorder(
                                borderRadius: BorderRadius.circular(5)),
                            child: Column(
                              mainAxisSize: MainAxisSize.min,
                              mainAxisAlignment: MainAxisAlignment.start,
                              children: <Widget>[
                                MyListTile(
                                  title: Text(
                                    '我的喜欢',
                                    style: TextStyle(
                                        color: Color(0xff303133), fontSize: 15),
                                  ),
                                  leading: Icon(
                                    Icons.favorite,
                                    color: Colors.red,
                                    size: 20,
                                  ),
                                  trailing: Icon(
                                    Icons.navigate_next,
                                    color: Colors.grey,
                                    size: 25,
                                  ),rightPadding: 10,),
                                Container(
                                  height: 58,
                                  child: Padding(
                                    padding:
                                    EdgeInsets.only(left: 8, right: 8, bottom: 8),
                                    child: ListView.builder(
                                      scrollDirection: Axis.horizontal,
                                      itemCount: 5,
                                      itemBuilder: (BuildContext context, int index) {
                                        return Container(
                                          width: 40,
                                          height: 40,
                                          margin: EdgeInsets.all(5),
                                          decoration: BoxDecoration(
                                              shape: BoxShape.rectangle,
                                              color: Colors.red,
                                              borderRadius: BorderRadius.circular(10.0),
                                              image: DecorationImage(
                                                  image: AssetImage(
                                                      'images/icon_header.jpg'),
                                                  fit: BoxFit.fill)),
                                        );
                                      },
                                    ),
                                  ),
                                ),
                              ],
                            ),
                          ),
                          Card(
                              shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(5)),
                              child: Container(
                                height: 180,
                                child: ListView.separated(
                                    itemBuilder: (BuildContext context, int index) {
                                      return SizedBox(
                                        child: MyListTile(
                                            rightPadding: 10,
                                            title: Text(
                                              message[index],
                                              style: TextStyle(
                                                  fontWeight: FontWeight.bold,
                                                  color: Color(0xff303133),
                                                  fontSize: 15),
                                            ),
                                            leading:Image.asset(leftIcon[index],width: 20,height: 20,),
                                            trailing: Icon(
                                              Icons.navigate_next,
                                              color: Colors.grey,
                                              size: 25,
                                            )),
                                        height: 45,
                                      );
                                    },
                                    separatorBuilder: (BuildContext context, int index) {
                                      return Divider(
                                        color: Color(0xffeeeeeee),
                                      );
                                    },
                                    itemCount: 4),
                              )),
                        ],
                      ),
                    )
                  ],
                ),
              ),
            )));
  }
}
